<template>
  <view class="container">
    <!-- 顶部banner -->
    <ne-swiper carousel-type="4"/>
    <!-- 功能导航 -->
    <nav-list :options="options"/>
    <!-- 法治讲堂 -->
    <view class="section">
      <text class="section-title">通知公告</text>
      <view class="article-list">
        <notice-card
            v-for="(item,index) in dataSource"
            :key="index"
            :row="item"
            @click="$toPage(`/pages/llhz/noticeDetail?indexCode=${item.indexCode}`)"
        />
        <van-empty v-if="!dataSource.length" description="暂无数据"/>
      </view>
    </view>
  </view>
</template>

<script>
import NavList from "../../components/NavList.vue";
import NoticeCard from "./components/noticeCard.vue";
import NeSwiper from "../../components/NeSwiper.vue";
import pagingMixin from "../../mixins/pagingMixin";
import {tbExternalLinkList} from "../../api/tbExternalLink";
export default {
  name: 'wx_pages_llhz_governmentPublic',
  components:{NeSwiper, NavList,NoticeCard},
  mixins:[pagingMixin],
  data() {
    return {
      restfulApi:'/tbPolicyAnnouncements/page',
      noticeList: [],
      options:[]
    }
  },
  methods:{
    async linkSearch(){
      let res = await tbExternalLinkList({linkType:'4',linkSubType:'9'})
      if(res.data && res.data.length>0){
        this.options = res.data.map(item=>({
          url:`/pages/share/qrcode?link=${item.linkUrl}&qrcode=${item.linkQrCode}`,
          title:item.linkName,
          icon:item.linkIcon
        }))
      }
    }
  },
  onLoad() {
    this.search()
    this.linkSearch()
  }
}
</script>

<style lang="scss">
.container {
  min-height: 100vh;
  background-color: #ffffff;
  padding: 12px;
  overflow: auto;
}

/* Banner */
.banner {
  width: 100%;
  height: 360rpx;
  background-color: #0052D9;
}

/* 法治讲堂 */
.section {
  margin-top: 20rpx;
}

.section-title {
  font-size: 34rpx;
  color:$uni-color-primary;
  font-weight: 500;
  margin: 20rpx 0;
  display: inline-block;
}

.article-list {
  display: flex;
  flex-direction: column;
  gap: 20rpx;
}
</style>
